<!DOCTYPE html>

<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表单</title>

    <style>
        form {
            margin: 25px;
        }
    </style>
</head>

<body>

    <!-- http://localhost:8080/register?username=ecut&gender=male -->
    <!-- 协议(protocol): http ( Hyper Text Transfer Protocol ) -->
    <!-- 主机(host): localhost 或 127.0.0.1 表示本地主机 -->
    <!-- 端口(port): 同一个主机上不同的服务使用 端口 区分 -->
    <!-- 路径(path): /register ( 端口号之后以及 ? 之前的内容 ) -->
    <!-- queryString: username=ecut&gender=male (在 ? 之后的部分) -->
    <form action="http://localhost:8080/first" method="get">
        <fieldset>
            <legend>GET</legend>
            <input type="text" name="username" placeholder="用户名">
            <input type="radio" name="gender" value="male">靓仔
            <input type="radio" name="gender" value="female">靓妹
            <input type="checkbox" name="hobby" value="eat">吃
            <input type="checkbox" name="hobby" value="eat-ji">吃鸡
            <input type="submit" value="提交">
        </fieldset>
    </form>


    <!-- enctype 指定 表单中内容的 编码类型 ( encoding type )-->
    <form action="http://localhost:8080/second" method="post" enctype="application/x-www-form-urlencoded">
        <fieldset>
            <legend>POST(application/x-www-form-urlencoded)</legend>
            <input type="text" name="username" placeholder="用户名">
            <input type="radio" name="gender" value="male">靓仔
            <input type="radio" name="gender" value="female">靓妹
            <input type="checkbox" name="hobby" value="eat">吃
            <input type="checkbox" name="hobby" value="eat-ji">吃鸡
            <input type="submit" value="提交">
        </fieldset>
    </form>

    <form action="http://localhost:8080/third" method="post" enctype="text/plain">
        <fieldset>
            <legend>POST(text/plain)</legend>
            <input type="text" name="username" placeholder="用户名">
            <input type="radio" name="gender" value="male">靓仔
            <input type="radio" name="gender" value="female">靓妹
            <input type="checkbox" name="hobby" value="eat">吃
            <input type="checkbox" name="hobby" value="eat-ji">吃鸡
            <input type="submit" value="提交">
        </fieldset>
    </form>

    <form action="http://localhost:8080/fourth" method="post" enctype="multipart/form-data">
        <fieldset>
            <legend>POST(multipart/form-data)</legend>
            <input type="text" name="username" placeholder="用户名">
            <input type="radio" name="gender" value="male">靓仔
            <input type="radio" name="gender" value="female">靓妹
            <input type="checkbox" name="hobby" value="eat">吃
            <input type="checkbox" name="hobby" value="eat-ji">吃鸡
            <input type="submit" value="提交">
        </fieldset>
    </form>

    <form action="http://localhost:8080/fifth" method="post" enctype="multipart/form-data">
        <fieldset>
            <legend>POST(multipart/form-data)</legend>
            <input type="text" name="username" placeholder="用户名">
            <input type="file" name="upfile">
            <input type="submit" value="提交">
        </fieldset>
    </form>

</body>

</html>